<template>
	<view>
		<view class="bgView">
			<view class="title">
				订单信息
			</view>
			<view v-for="(item,index) in list" :key="index">
				<view class="item flex-row-space-between">
					<view class="leftTitle">
						{{item.name}}
					</view>
					<view class="rightTitle">
						{{item.value}}
					</view>
				</view>
				<view v-if="index!=list.length-1" class="line">

				</view>
			</view>

		</view>
		<view class="bgView">
			<view class="title">
				订单进度
			</view>
			<view v-for="(item,index) in data.log" :key="index">
				<view class="item1 flex-row-space-between">
					
					<view class="flex-row-flex-start" style="width: 180rpx;margin-right: 100rpx;">
						<view class="leftTitle">
							{{item.ctime}}
						</view>
					</view>
					<view class="rightTitle flex1">
						{{item.remark}}
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	import {
		mapActions,
		mapState
	} from "vuex";
	import {
		orderInfo,
	} from '@/api/index.js'
	export default {
		components: {},
		computed: {

		},
		data() {
			return {
				data:{},
				list1: [{
						name: '提现金额',
						value: '1000元'
					},
					{
						name: '实际到账',
						value: '1000元'
					},
					{
						name: '综合服务费',
						value: '10元'
					},
				
				],
				list: [{
						name: '提现金额',
						value: '1000元'
					},
					{
						name: '实际到账',
						value: '1000元'
					},
					{
						name: '综合服务费',
						value: '10元'
					},
					{
						name: '申请日',
						value: '2017/09/17 01:22:11'
					},
					{
						name: '到账银行',
						value: '工商银行（尾号1234)'
					},
					{
						name: '订单状态',
						value: '已完成'
					},
				],
				data: {},
				id:0,

			}
		},
		computed: {
			...mapState([
				'baseColor'
			]),
		},
		onShow() {

		},
		onLoad(e) {
			this.id=e.id
			this.orderInfo()
		},
		//下拉刷新
		onPullDownRefresh() {


		},
		//加载更多
		onReachBottom() {

		},
		onPageScroll(e) {
			// if (e.scrollTop > 20) {
			// 	this.backgroundColor = "#FBF9FF"
			// } else {
			// 	this.backgroundColor = "#ffffff00"
			// }
		},
		methods: {
			orderInfo() {

				var data = {
					id: this.id
				}
				orderInfo(data).then(res => {
				this.data=res.data
				this.list[0].value=this.data.price+'元'
				this.list[1].value=this.data.d_price+'元'
				this.list[2].value=this.data.fu_price+'元'
				this.list[3].value=this.data.ctime
				this.list[4].value=this.data.bank.name
				this.list[5].value=this.data.order_status
				})
			},

			showToast(title) {
				uni.showToast({
					title: title,
					icon: 'none'
				})
			},
			toUrl(url) {
				uni.navigateTo({
					url: url
				})
			},
		}
	}
</script>

<style lang="scss">
	.bgView {
		padding: 0 30rpx;
		margin: 20rpx 30rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
	}

	.title {
		padding-top: 30rpx;
		margin-bottom: 20rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 600;
		font-size: 32rpx;
		color: #16171B;
	}

	.item {
		height: 100rpx;
	}

	.leftTitle {
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #666666;
	}

	.rightTitle {
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #16171B;
	}

	.line {
		height: 2rpx;
		background: #F6F6F6;
	}
	.item1 {
		height: 140rpx;
	}
</style>